@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  body {
    @apply bg-gray-50 text-gray-900 dark:bg-gray-900 dark:text-gray-100;
  }
}

@layer components {
  .btn-primary {
    @apply px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors;
  }

  /* 新增渐变背景 */
  .gradient-bg {
    @apply bg-gradient-to-r from-indigo-500 via-purple-500 to-pink-500;
  }

  /* 新增卡片样式 */
  .card {
    @apply bg-white dark:bg-gray-800 rounded-lg shadow-lg p-6;
  }

  /* 新增玻璃拟态效果 */
  .glass-effect {
    @apply backdrop-blur-sm bg-white/30 dark:bg-gray-800/30 border border-white/10 dark:border-gray-700/10;
  }

  /* 新增按钮hover效果 */
  .btn-hover-effect {
    @apply transform transition-all hover:scale-105 hover:shadow-md;
  }

  /* 新增加载动画 */
  .loading-spinner {
    @apply animate-spin h-8 w-8 border-4 border-gray-300 rounded-full border-t-primary;
  }
}
